<template>
  <div class="project_doc">
    <el-form
      :model="queryParams"
      ref="queryForm"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="项目名称" prop="entryname">
        <el-input
          v-model="queryParams.entryname"
          placeholder="请输入项目名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="利用方式" prop="utilizationmode">
        <el-select
          v-model="queryParams.utilizationmode"
          placeholder="请选择利用方式"
          clearable
          size="small"
        >
          <el-option
            v-for="dict in dict.type.utilizationmode"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="使用状态" prop="enabled">
        <el-select
          v-model="queryParams.enabled"
          placeholder="请选择使用状态"
          clearable
          size="small"
        >
          <el-option
            v-for="dict in dict.type.enabled"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          >导出</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="projectinfoList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column
        label="编号"
        align="center"
        width="55"
        prop="projectno"
      />
      <el-table-column
        label="项目名称"
        align="center"
        width="250"
        prop="entryname"
      />
      <el-table-column label="柱状图" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.status == 1">已上传</el-tag>
          <el-tag type="danger" v-else>未上传</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="水质图" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.status == 1">已上传</el-tag>
          <el-tag type="danger" v-else>未上传</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="文档资料" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.status == 1">已上传</el-tag>
          <el-tag type="danger" v-else>未上传</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="使用状态" align="center" prop="enabled">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.enabled" :value="scope.row.enabled" />
        </template>
      </el-table-column>

      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <!--  <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['dr:projectinfo:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['dr:projectinfo:remove']">删除</el-button> -->
          <!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" >修改</el-button> -->
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            >删除</el-button
          >
          <!-- <el-button size="mini" type="text" icon="el-icon-edit" @click="editdoc(scope.row)" >基本资料</el-button> -->
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <!-- 项目基本资料弹出框 -->
    <el-dialog
      :title="title"
      :visible.sync="open"
      width="900px"
      append-to-body
      custom-class="projectdocDialog"
    >
      <template slot="title">
        <div>
          <i class="el-icon-edit"></i>
          <span> 项目文档资料</span>
        </div>
      </template>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <!-- <table class="table"> -->
        <caption style="font-size: 20px; padding: 6px 0px">
          项目基本信息
        </caption>
        <tr>
          <th class="leibie1">项目名称：</th>
          <th>
            <el-input v-model="form.entryname" placeholder="请输入项目名称" />
          </th>
          <th class="leibie1">联系电话：</th>
          <th>
            <el-input v-model="form.telephone" placeholder="请输入联系电话" />
          </th>
        </tr>
        <tr>
          <th class="leibie1">项目单位：</th>
          <th>
            <el-input v-model="form.company" placeholder="请输入项目单位" />
          </th>
          <th class="leibie1">利用方式：</th>
          <th>
            <el-select
              v-model="form.utilizationmode"
              placeholder="请选择利用方式"
            >
              <el-option
                v-for="dict in dict.type.utilizationmode"
                :key="dict.value"
                :label="dict.label"
                :value="parseInt(dict.value)"
              ></el-option>
            </el-select>
          </th>
        </tr>
        <tr>
          <th class="leibie1">项目地址：</th>
          <th>
            <el-input v-model="form.address" placeholder="请输入详细地址" />
          </th>
          <th class="leibie1">起用日期：</th>
          <th>
            <el-date-picker
              clearable
              size="small"
              v-model="form.startdate"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择起用日期"
            >
            </el-date-picker>
          </th>
        </tr>
        <tr>
          <th class="leibie1">项目联系人：</th>
          <th>
            <el-input v-model="form.contacts" placeholder="请输入联系人" />
          </th>
          <th class="leibie1">使用状态：</th>
          <th>
            <el-select v-model="form.enabled" placeholder="请选择使用状态">
              <el-option
                v-for="dict in dict.type.enabled"
                :key="dict.value"
                :label="dict.label"
                :value="parseInt(dict.value)"
              ></el-option>
            </el-select>
          </th>
        </tr>
        <tr>
          <th class="xmgk">项目概况：</th>
          <th colspan="3">
            <el-input
              v-model="form.content"
              autosize
              type="textarea"
            ></el-input>
          </th>
        </tr>
        <div class="monitorData">
          <el-card class="single-card">
            <div slot="header" class="single-header">
              <span
                style="
                  display: inline-block;
                  width: 730px;
                  text-align: center;
                  font-size: 18px;
                "
                >项目基本文档资料</span
              >
              <!-- <el-button style="float: right; padding: 3px 0" type="text" icon="el-icon-plus" @click="handleDocmentDialog">录入</el-button> -->
              <!-- <el-button style="float: right; padding: 3px 0" type="text"> 修改</el-button>
                <el-button style="float: right; padding: 3px 4px" type="text">新增</el-button> -->
            </div>
            <div class="single_content">
              <el-table
                :data="documentData"
                :header-cell-style="rowClass"
                style="width: 100%"
                @row-click="handleDocumentRow"
                label-width="68px"
              >
                <el-table-column label="序号" type="index" align="center" />
                <el-table-column label="名称" align="center" prop="fileName" />
                <el-table-column label="说明" align="center" prop="fileModule">
                  <template slot-scope="scope">
                    <span v-if="scope.row.fileModule == 'zhuzhuangtu'"
                      >项目地质柱状图</span
                    >
                    <span v-if="scope.row.fileModule == 'shuizhitu'"
                      >项目水质分析图</span
                    >
                    <!-- <span v-if="scope.row.fileModule == 'othersdocument'">其他文档资料</span> -->
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" width="260">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-view"
                      @click="handleDocumentSee(scope.row)"
                      :disabled="scope.row.disabled"
                      >查看</el-button
                    >
                    <el-upload
                      ref="upload"
                      :limit="1"
                      :before-upload="getFileType"
                      :accept="upload.file_type"
                      :action="upload.url"
                      :data="upload.data"
                      :headers="upload.headers"
                      :show-file-list="false"
                      :file-list="upload.fileList"
                      :on-progress="handleFileUploadProgress"
                      :on-success="handleFileSuccess"
                      :auto-upload="true"
                    >
                      <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-view"
                        @click="xuanze(scope.row.fileModule)"
                        >选择</el-button
                      >
                      <!-- <el-button style="margin-left: 10px" icon="el-icon-upload" type="success" :loading="upload.isUploading" @click="submitUpload">上传到服务器</el-button> -->
                    </el-upload>
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-delete"
                      @click="handleDocumentDelete(scope.row)"
                      :disabled="scope.row.disabled"
                      >删除</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
              <!-- <el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="[seeDocumentUrl]" /> -->
            </div>
          </el-card>
        </div>
      </el-form>

      <div class="monitorData">
        <el-card class="single-card">
          <div slot="header" class="single-header">
            <span
              style="
                display: inline-block;
                width: 730px;
                text-align: center;
                font-size: 18px;
              "
              >其他文档资料</span
            >
            <!-- <el-button
              style="float: right; padding: 3px 0"
              type="text"
              icon="el-icon-plus"
              @click="handleDocmentDialog"
              >新增</el-button
            > -->
            <el-upload
              ref="upload"
              :limit="3"
              :before-upload="getFileType"
              :accept="upload.file_type"
              :action="otherUrl"
              :data="upload.data"
              :headers="upload.headers"
              :show-file-list="false"
              :file-list="upload.fileList"
              :on-progress="handleFileUploadProgress"
              :on-success="handleFileSuccess"
              :auto-upload="true"
              style="float: right; padding: 3px 0"
            >
              <el-button
                size="mini"
                type="text"
                icon="el-icon-plus"
                @click="xuanze('othersdocument')"
                >新增</el-button
              >
              <!-- <el-button style="margin-left: 10px" icon="el-icon-upload" type="success" :loading="upload.isUploading" @click="submitUpload">上传到服务器</el-button> -->
            </el-upload>
            <!-- <el-button style="float: right; padding: 3px 0" type="text" icon="el-icon-plus" @click="handleDocmentDialog">录入</el-button> -->
            <!-- <el-button style="float: right; padding: 3px 0" type="text"> 修改</el-button>
            <el-button style="float: right; padding: 3px 4px" type="text">新增</el-button> -->
          </div>
          <div class="single_content">
            <el-table
              :data="otherData"
              style="width: 100%"
              @row-click="handleDocumentRow"
              :header-cell-style="rowClass"
            >
              <el-table-column label="序号" type="index" />
              <el-table-column label="名称" align="center" prop="fileName" />
              <el-table-column label="说明" align="center" prop="content">
                <template slot-scope="scope">
                  <!-- <span v-if="scope.row.fileModule == 'zhuzhuangtu'">项目地质柱状图</span>1
                  <span v-if="scope.row.fileModule == 'shuizhitu'">项目水质分析图</span>
                  <span v-if="scope.row.fileModule == 'othersdocument'">其他文档资料</span> -->
                </template>
                <!-- <span v-if="scope.row.fileModule == 'othersdocument'">其他文档资料</span> -->
              </el-table-column>
              <el-table-column label="操作" align="center" width="260">
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-view"
                    @click="handleDocumentSee(scope.row)"
                    >查看</el-button
                  >
                  <el-upload
                    ref="upload"
                    :limit="2"
                    :before-upload="getFileType"
                    :accept="upload.file_type"
                    :action="upload.url"
                    :data="upload.data"
                    :headers="upload.headers"
                    :show-file-list="false"
                    :file-list="upload.fileList"
                    :on-progress="handleFileUploadProgress"
                    :on-success="handleFileSuccess"
                    :auto-upload="true"
                  >
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-view"
                      @click="xuanze(scope.row.fileModule)"
                      >选择</el-button
                    >
                  </el-upload>
                  <el-button
                    size="mini"
                    type="text"
                    icon="el-icon-delete"
                    @click="handleDocumentDelete(scope.row)"
                    >删除</el-button
                  >
                  <!-- <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDeleteWell(scope.row)">删除</el-button> -->
                </template>
              </el-table-column>
            </el-table>
            <el-image-viewer
              v-if="showViewer"
              :on-close="closeViewer"
              :url-list="[seeDocumentUrl]"
            />
          </div>
        </el-card>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <el-image-viewer
      v-if="showViewer"
      :on-close="closeViewer"
      :url-list="[seeDocumentUrl]"
    />
    <el-dialog
      :visible.sync="dialogopen"
      width="500px"
      custom-class="documentDialog"
      @close="documentDialogClose"
    >
      <div class="documentType">
        <!-- <el-radio v-model="docmentRadio" :label="1">柱状图</el-radio>
        <el-radio v-model="docmentRadio" :label="2">水质分析图</el-radio> -->
        <el-radio v-model="docmentRadio" :label="3">其他文档资料</el-radio>
      </div>
      <div class="documentProgress">
        <el-progress
          :text-inside="true"
          :stroke-width="34"
          :percentage="percentage"
        ></el-progress>
      </div>
      <div class="documentUpload">
        <el-upload
          ref="upload"
          :limit="3"
          :before-upload="getFileType"
          :accept="upload.file_type"
          :action="upload.url"
          :data="upload.data"
          :headers="upload.headers"
          :show-file-list="false"
          :file-list="upload.fileList"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="true"
        >
          <el-button slot="trigger" type="primary" @click="handleAdd"
            >选取文件</el-button
          >
          <!-- <el-button style="margin-left: 10px" icon="el-icon-upload" type="success" :loading="upload.isUploading" @click="submitUpload">上传到服务器</el-button> -->
        </el-upload>
      </div>
      <el-tag
        >可上传文件格式：.jpg,.jpeg,.png,.bmp,.pdf,.JPG,.JPEG,.BMP,.PDF,.xls,.docx,.xlsx</el-tag
      >
      <!-- 文件说明：<el-input v-model="content" autosize type="textarea"></el-input> -->
    </el-dialog>
    <!-- 选择上传弹出框 -->
  </div>
</template>

<script>
import {
  listProjectinfo,
  getProjectinfo,
  delProjectinfo,
  addProjectinfo,
  updateProjectinfo,
} from "@/api/geoInfor/projectinfo";
import {
  listEquipmentinfo,
  getEquipmentinfo,
  delEquipmentinfo,
  addEquipmentinfo,
  updateEquipmentinfo,
} from "@/api/geoInfor/equipmentinfo";
import {
  listGeothermalwellinfo,
  getGeothermalwellinfo,
  delGeothermalwellinfo,
  addGeothermalwellinfo,
  updateGeothermalwellinfo,
} from "@/api/geoInfor/geothermalwellinfo";

import ElImageViewer from "element-ui/packages/image/src/image-viewer";
import { getToken } from "@/utils/auth";
import {
  listUpload,
  listByProjectUpload,
  getUpload,
  delUpload,
  addUpload,
  updateUpload,
} from "@/api/uploadfile";
export default {
  // name: "Projectinfo",
  dicts: ["region_code", "geothermaltype", "utilizationmode", "enabled"],
  components: {
    ElImageViewer,
  },
  data() {
    return {
      dialogopen: false,
      seeUrl: "",
      showViewer: false, // 显示查看器
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 项目基本信息表格数据
      projectinfoList: [],
      projectEntryname: "",
      projectOptions: {},
      projectno: null,
      seeDocumentUrl: "",
      // 弹出层标题
      title: "",
      percentage: 0,
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 9,
        entryname: null,
        addcode: null,
        geothermaltype: null,
        utilizationmode: null,
        enabled: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      seeUrl: "",
      tableData: [],
      showViewer: false, // 显示查看器
      otherUrl:process.env.VUE_APP_BASE_API + '/dr/upload/morefile',
      upload: {
        file_type:
          ".jpg,.jpeg,.png,.bmp,.pdf,.JPG,.JPEG,.BMP,.PDF,.xls,.docx,.xlsx",
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/dr/upload/onefile",
        // 上传的文件列表
        fileList: [],
        data: {
          projectno: 1,
          file_type: ".jpg, .png",
          uploader: null,
          file_module: "zhuzhuangtu",
        },
        // projectno:  drfb 41862   kfly 1161225  gzgx 726724 drcy 418325   file_module drfbtu shuizhitu zhuzhuangtu
      },
      docmentRadio: null,
      fileId: null,
      // currentIndex: 2,
      seePath: "",
      //查询参数
      uploadQueryParams: {
        projectno: null,
        status: null,
        // file_module:"shuizhitu",
      },
      uploadUpdateParams: {
        fileId: null,
        fileUsed: null,
      },
      percentage: 0,
      open: false,
      projectOpen: false,
      wellOpen: false,
      deviceOpen: false,
      activeProjectinfo: {},
      activeWellInfor: [],
      monitorData: [],
      documentData: [],
      otherData: [],
      jbzlData: [],
      qtzlData: [],
      monitorDataPage: {
        total: 1,
        pageNum: 1,
        pageSize: 5,
      },
      projectForm: {},
      wellForm: {},
      deviceForm: {},
      rules: {},
      wellnos: [],
      ListByProjectUpload:[],
    };
  },
  watch: {
    docmentRadio: function (newValue, oldValue) {
      if (newValue == 1) {
        this.upload.data.file_module = "zhuzhuangtu";
      } else if (newValue == 2) {
        this.upload.data.file_module = "shuizhitu";
      } else if (newValue == 3) {
        this.upload.data.file_module = "othersdocument";
        url: process.env.VUE_APP_BASE_API + "/dr/upload/morefile";
      }
      console.log(this.upload);
    },
  },
  computed: {
    pageMonitorData() {
      let offset =
        (this.monitorDataPage.pageNum - 1) * this.monitorDataPage.pageSize;
      let pageSize = this.monitorDataPage.pageSize;
      return offset + pageSize >= this.monitorData.length
        ? this.monitorData.slice(offset, this.monitorData.length)
        : this.monitorData.slice(offset, offset + pageSize);
    },
    fileName() {
      console.log(this.upload.fileList[0]);
      return this.upload.fileList[0];
    },
  },
  created() {
    this.getList();
    this.upload.data.uploader = this.$store.getters.name;
  },

  methods: {
    handleSee(seeInfo) {
      this.showViewer = true;
      this.seeUrl = seeInfo.path;
      /* console.log(this.seePath) */
    },
    handleAdd() {
      this.percentage = 0;
      this.upload.fileList = [];
    },
    // 文件提交处理
    submitUpload() {
      this.$refs.upload.submit();
    },
    closeViewer() {
      this.showViewer = false;
    },
    /** 查询项目基本信息列表 */
    getList() {
      this.loading = true;
      listProjectinfo(this.queryParams).then((response) => {
        this.projectinfoList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    getListByProjectUpload(){
      listByProjectUpload({}).then((res)=>{
        
      })
    },
    getProjectno2nameList() {
      listProjectinfo({
        entryname: null,
        addcode: null,
        geothermaltype: null,
        utilizationmode: null,
        enabled: null,
      }).then((response) => {
        const projectinfoList1 = response.rows;
        projectinfoList1.forEach((item) => {
          this.projectno2name[item.projectno] = item.entryname;
        });
        console.log(this.projectno2name);
      });
    },
    /**项目资料信息 */
    handleDocumentRow() {},
    handleDocumentSee(document) {
      let fileType = document.fileType;
      if (fileType == ".pdf") {
        window.open(process.env.VUE_APP_BASE_API + document.filePath);
      } else if (fileType == ".jpg" || fileType == ".png") {
        this.showViewer = true;
        this.seeDocumentUrl = process.env.VUE_APP_BASE_API + document.filePath;
      }
    },
    //选择基本资料上传
    xuanze(fileModule) {
      this.upload.data.projectno = this.projectno;
      this.upload.data.file_module = fileModule;
    },
    /**打开项目录入dialog */
    handleDocmentDialog() {
      this.dialogTitle = "项目资料录入";
      this.open = true;
      this.dialogopen = true;
      this.data.projectno = projectno;
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
      this.percentage = ((event.loaded / event.total) * 100) | 0; //百分比
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      console.log(this.$refs.upload);
      this.$refs.upload.clearFiles();
      this.upload.fileList = [];

      this.$alert(
        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
          response?.msg +
          "</div>",
        "导入结果",
        { dangerouslyUseHTMLString: true }
      );
      this.seePath = response.url;
      this.getListUpload();
      // this.$refs.upload.clearFiles();
    },
    // handleUpdate(row) {
    //   this.upload.fileList = [
    //     { name: this.form.fileName, url: this.form.filePath },
    //   ];
    // },
    getFileType(file) {
      const fileName = file.name;
      const fileType = fileName.substring(fileName.lastIndexOf("."));
      this.upload.data.file_type = fileType;
    },
    /**上传结束 */
    documentDialogClose() {
      this.percentage = 0;
      this.getListUpload();
    },
    /**获取文档资料列表 */
    getListUpload() {
      listUpload(this.uploadQueryParams).then((res) => {
        const shuizhituData = res.rows.filter(
          (data) => data.fileModule === "shuizhitu"
        );
        if (!shuizhituData.length)
          shuizhituData.push({
            fileModule: "shuizhitu",
            disabled: true,
            projectno: this.projectno,
          });
        const zhuzhuangtuData = res.rows.filter(
          (data) => data.fileModule === "zhuzhuangtu"
        );
        if (!zhuzhuangtuData.length)
          zhuzhuangtuData.push({
            fileModule: "zhuzhuangtu",
            disabled: true,
            projectno: this.projectno,
          });
        this.documentData = [...zhuzhuangtuData, ...shuizhituData];
        // this.documentData=[...shuizhituData]
        this.otherData = res.rows.filter(
          (data) => data.fileModule === "othersdocument"
        );
      });
    },
    // 关闭查看器
    closeViewer() {
      this.showViewer = false;
    },
    getData() {
      setTimeout(() => {
        console.log(this.devices);
      }, 1000);
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        projectno: null,
        entryname: null,
        longitude: null,
        latitude: null,
        addcode: null,
        address: null,
        company: null,
        geothermaltype: null,
        contacts: null,
        telephone: null,
        utilizationmode: null,
        heatingarea: null,
        hydrochemicaltype: null,
        welldepth: null,
        waterlevel: null,
        temperature: null,
        wellflow: null,
        startdate: null,
        enabled: null,
        content: null,
        createtime: null,
        updatetime: null,
        inputuser: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.projectno);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "项目基本资料";
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const projectnos = row.projectno || this.ids;
      this.$modal
        .confirm('是否确认删除项目基本信息编号为"' + projectnos + '"的数据项？')
        .then(function () {
          return delProjectinfo(projectnos);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const projectno = row.projectno || this.ids;
      this.projectno = projectno;
      this.uploadQueryParams.projectno = projectno;
      // this.$store.commit("GET_ACTIVEPROJECT", item);
      this.upload.data.projectno = projectno;
      getProjectinfo(projectno).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "项目基本资料";
      });
      this.getListUpload();
      console.log(this.documentData)
    },
    // 查看按钮操作
    handlelook(row) {
      console.log(row);
    },
    editdoc(row) {
      this.open = true;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.projectno != null) {
            updateProjectinfo(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addProjectinfo(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    handleFileChange(file, fileList) {
      if (fileList.length > 1) {
        fileList = [file];
      }
      console.log(file, fileList);
    },
    /** 删除文档资料按钮 */
    handleDocumentDelete(row) {
      let fileId = row.fileId;
      this.$modal
        .confirm("是否删除该文档资料？")
        .then(function () {
          return delUpload(fileId);
        })
        .then(() => {
          this.getListUpload();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    rowClass() {
      return "background:rgb(193, 194, 255, 0.6);font-size:14px";
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "dr/projectinfo/export",
        {
          ...this.queryParams,
        },
        `projectinfo_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
<style lang="scss" scoped>
/* .el-dialog_body{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
} */
.el-image-viewer__wrapper {
  z-index: 10000;
}
.el-dialog__header {
  font-size: 40px;
}
.geo_info_btn {
  margin-top: 10px;
  width: 100%;
  /**& 用在嵌套代码里，来引用父元素 */
  /* border: 1px solid rgb(13, 175, 21); */
  display: flex;
  /**flex居中 */
  align-items: center;
  justify-content: center;
  .el-button {
    width: 130px;
    height: 40px;
    font-size: 18px;
    color: rgb(17, 17, 17);
    border-radius: 15px;
    margin-left: 10px;
  }
}
.tuimg {
  margin-top: 10px;
  width: 100%;
  height: 586px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgb(21, 24, 216);
}
.el.form {
  border-left: 10px;
  float: right;
  right: 0;
  width: 40%;
  height: 100%;
}
.leftcontainer {
  display: flex;
  height: 100%;
  width: 60%;
  flex-direction: row;
  flex-wrap: wrap;
}
.tu {
  // display: flex;
  height: 60%;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
}
.projectdoc {
  /* float:right; */
  height: 1060px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  widows: 100;
}
/* .el-input{
  width:20%;
} */
.zhuzhuangtu {
  display: flex;
  align-items: center;
  justify-content: center;
  left: 0;
  width: 45%;
  height: 70%;
  /* height: 20%; */
  border: 1px solid;
}
.zhuzhuagntusubmit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45%;
  height: 30%;
  /* height: 60px; */
  /* border: 1px solid; */
}
.watertu {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10%;
  /* display: flex; */
  /* left: 0; */
  width: 45%;
  height: 70%;
  border: 1px solid;
}
.watertusubmit {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10%;
  /* display: flex; */
  /* left: 0; */
  width: 45%;
  height: 30%;
  /* border: 1px solid; */
}
.img {
  width: 100px;
  height: 100px;
}
.otherdoc {
  display: flex;
  /* align-items: center;
  justify-content: center; */
  height: 40%;
  /* width:1500px; */
  /* position: absolute; */
  width: 100%;
  /* bottom: 0px; */
  border: 1px solid;
}
.otherdocsubmit {
  /* display: flex; */
  /* flex-direction: row; */
  margin-top: 20px;
  right: 5%;
  height: 5%;
  width: 100%;
  font-size: 20px;
  align-items: center;
  /* flex-wrap: wrap; */
  /* left:200px; */
}
.otherdocsubmit1 {
  position: relative;
  float: right;
  margin-left: 10%;
  /* left:600px; */
  float: right;
}
.tu_active {
  background-color: rgba(1, 128, 128, 0.8);
}
.table,
th,
tr {
  border: 1px solid black;
  border-collapse: collapse;
  text-align: center;
}
.xmgk {
  vertical-align: middle;
  text-align: center;
  height: 100px;
  background-color: rgb(193, 194, 255, 0.6);
}
.leibie {
  width: 100px;
  background-color: rgb(193, 194, 255, 0.6);
}
.leibie1 {
  width: 200px;
  background-color: rgb(193, 194, 255, 0.6);
}
.leibie2 {
  width: 100px;
}
.leibie3 {
  width: 100px;
  background-color: rgb(193, 194, 255, 0.6);
}
.xuanze1 {
  width: 30px;
}
</style>
<style lang="scss">
.projectdocDialog {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  .el-dialog__header {
    padding-top: 10px;
    font-size: 18px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-color: #ebebeb;
    border-bottom: 1px solid rgb(185, 181, 181) !important;
  }
  .el-dialog__body {
    padding: 5px 40px !important;
  }
}
</style>
